
window.onload=function(){
	var maxScroll=600;
	var jdHeader=document.querySelector('.jd-header');

	window.addEventListener('scroll' ,function(){
		var _scrollTop = document.documentElement.scrollTop || window.pageYOffset || document.body.scrollTop;
	 	
	 	if(_scrollTop<maxScroll){
	 		jdHeader.style.backgroundColor="rgba(203,18,36,"+ _scrollTop/maxScroll +")";
	 	}else{
	 		jdHeader.style.backgroundColor="rgba(203,18,36,1)";
	 	}
	});


	// var jdSkillb=document.querySelector('.jd-skill-b');
	// console.log(jdSkillb);

	var jdSkillUl=document.querySelector('.jd-skill-ul');
	// console.log(jdSkillUl);
	var jdSkillLI=jdSkillUl.querySelectorAll('li');
	var jdSkillLiWidth=jdSkillLI[0].offsetWidth;
	jdSkillUl.style.width=jdSkillLI.length*jdSkillLiWidth+"px";


	// 京东快报
	var jdNewContent=document.querySelector('.content');
	var jdNewsCon=document.querySelector('.jd-news-con');
	var jdNewScroll=jdNewContent.offsetHeight;
	var jdNewsLis=jdNewsCon.querySelectorAll('li');
	// console.log(jdNewsLis);
	var index=0;

	jdNewsCon.appendChild(jdNewsLis[0].cloneNode(true));

	var timer=setInterval(function(){
		index++;
		jdNewsCon.style.transition="transform 1s";
		jdNewsCon.style.transform="translateY("+ (-jdNewScroll*index) +"px)";
		// console.log(index);
	},2000)

	// console.log(jdNewsLis.length);
	// console.log(index);

	jdNewsCon.addEventListener('transitionend',function(){
		// console.log(index);
		if(index>jdNewsLis.length-1){
			index=0;
			jdNewsCon.style.transition="none";
			jdNewsCon.style.transform="translateY(0px)";
		}
	});


	var skillCenter=document.querySelector('#skillcen');
	// console.log(skillCenter);
	var skillSpans=skillCenter.querySelectorAll('span');
	// console.log(skillSpans);

	var nowDate=new Date();
	var newDate=new Date('Jan 14 2017 20:00:00');

	var dateT=Math.floor((newDate-nowDate)/1000);
	var str="";

	var skillTimer=setInterval(function(){

		dateT--;

		if(dateT<=0){
			clearInterval(skillTimer);
			return false;
		}

		var h=Math.floor(dateT%86400/3600);
		var m=Math.floor(dateT%3600/60);
		var s=Math.floor(dateT%60);
		// console.log(h,m,s)

		// skillSpans[0].innerHTML=Math.floor(h/10);
		// skillSpans[1].innerHTML=Math.floor(h%10);
		// skillSpans[3].innerHTML=Math.floor(m/10);
		// skillSpans[4].innerHTML=Math.floor(m%10);
		// skillSpans[6].innerHTML=Math.floor(s/10);
		// skillSpans[7].innerHTML=Math.floor(s%10);
		str=toTwo(h) + ":" +toTwo(m)+ ":" + toTwo(s);

		for(var i=0;i<skillSpans.length;i++){
			skillSpans[i].innerHTML=str.charAt(i);
		}

	},1000);


	function toTwo(n){
		return n = n>9? ""+ n : "0" + n;
	}


	// 轮播图
	var banner=document.querySelector('.ban');
	var banUl=banner.querySelector('.ban-img');
	var banLis=banUl.querySelectorAll('li');
	var banOL=banner.querySelector('.ban-squa');
	var bannerWidth=document.documentElement.offsetWidth;
	// console.log(banLis.length-1);
	// 根据li高度 改变ul 高度
	banUl.style.height=banLis[0].offsetHeight+"px";

	// 动态生成小圆点
	
	for (var i=0;i<banLis.length;i++){
		var li=document.createElement("li");

		if(i==0){
			li.classList.add('active');
		}
		banOL.appendChild(li);
	}

	// 位置初始化
	var left=banLis.length-1;
	var center=0;
	var right=1;

	settransform();

	function showNext(){
		left=center;
		center=right;
		right++;
		if(right>banLis.length-1){
			right=0;
		};

		setPoint();

		setransition(true,true,false);

		
		settransform();
	}

	function showPrev(){
		right=center;
		center=left;
		left--;
		if(left<0){
			left=banLis.length-1;
		};

		setPoint();

		setransition(false,true,true);

		
		settransform();
	}
	var banTimer=setInterval(showNext, 1500);

	var banOlLis=banOL.querySelectorAll('li');

	function setPoint(){
		for (var i=0;i<banOlLis.length;i++){
			banOlLis[i].classList.remove('active');
		}
		banOlLis[center].classList.add('active');
	}

	// 手指touch切换图片
	banner.addEventListener('touchstart',touchstartHandler);
	banner.addEventListener('touchmove',touchmoveHandler);
	banner.addEventListener('touchend',touchendHandler);

	// 记录手指落点  最终移动的落点
	var startX=0;
	var moveX=0;
	var startTime=null;

	function touchstartHandler(event){
		startTime=new Date();

		clearInterval(banTimer);

		startX=event.touches[0].pageX;

		// 清除过渡
		setransition(false,false,false);

	}
	function touchmoveHandler(event){
		moveX=event.touches[0].pageX;

		var dx=moveX-startX;

		settransform(dx);

	}
	function touchendHandler(event){
		var dTime=new Date() - startTime;

		var endX=event.changedTouches[0].pageX-startX;

		if(endX< (-bannerWidth/3) || (dTime<300&&endX<-30)){
			showNext();
		}else if(endX > (bannerWidth/3) || (dTime < 300 && endX > 30)){
			showPrev();
		}else{
			setransition(true,true,true);

			settransform();

		}
		banTimer=setInterval(showNext, 1500);
	}

	function settransform(dx){
		dx = dx||0;
		banLis[center].style.transform = 'translateX('+ dx +'px)';
		banLis[left].style.transform = 'translateX('+ (-bannerWidth + dx) +'px)';
		banLis[right].style.transform = 'translateX('+ (bannerWidth + dx) +'px)';
	}

	function setransition(a,b,c){
		if(a){
			banLis[left].style.transition="transform 1s";
		}else{
			banLis[left].style.transition="none";
		}
		if(b){
			banLis[center].style.transition="transform 1s";
		}else{
			banLis[center].style.transition="none";
		}
		if(c){
			banLis[right].style.transition="transform 1s";
		}else{
			banLis[right].style.transition="none";
		}
	} 

}